<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body{
            
            background:url("img/bg.png") no-repeat;
        }
        .center{
            background-color: white;
            margin: 50px auto;
            text-align: center;
            width: 400px;
            /*border: 1px solid red;*/
        }
        /*.center span{
            display: inline-block;
            height: 100px;
            line-height: 100px;
        }*/
    </style>
</head>
<body>
    <img src="img/logo.png">
    <div class="center">
        <span>注册详情</span>
        <hr>
        <form action="#" method="get">
            <div>姓名：<input type="text" name="userName" value="" placeholder="账号/邮箱" required><br>
                密码：<input type="password" name="password" value="" placeholder="密码" required><br>
                邮箱：<input type="email" name="email" value="" placeholder="邮箱" required><br>
                手机：<input type="tel" name="tel" value="" placeholder="手机" required><br>
                <hr>
            </div>
            <div>
                性别：<input type="radio" name="gender"  value="man">男&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <input type="radio" name="gender" value="women">女<br>
                关注：<input type="checkbox" name="like">娱乐&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <input type="checkbox" name="like">军事<br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="like">科技&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <input type="checkbox" name="like">体育<br>
                生日：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="date" name="birthday" value=""/><br>
                城市：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<select id="city" name="city">
                <option>---请选择所在城市---</option>
                <optgroup label="直辖市">
                    <option>北京</option>
                    <option>上海</option>
                    <option>广州</option>
                    <option>深圳</option>
                </optgroup>
                <optgroup label="省会市">
                    <option>西安</option>
                    <option>杭州</option>
                    <option>郑州</option>
                    <option>武汉</option>
                </optgroup>
            </select><br>
                <hr>
                <span>个性签名：</span><br>
                <textarea id="desc" name="desc" rows="5" cols="40" placeholder=" 请写下您的与众不同"></textarea>
            </div>
            <hr/>
            <button type="submit">注册</button>
            <button type="reset">重置</button>
        </form>
    </div>
</body>
</html>